
Ext.define('FrontSuite.view.InfoAccordion', {
    id:           'accordion-info-panel',
    extend:       'Ext.Panel',  // defines the superclass. results in class inheritance.

    defaults : {
        bodyStyle: 'padding:10px'
    },
    layout: {
        type          : 'accordion',
        titleCollapse : false,
        animate       : true,
        activeOnTop   : true
    },
    items: [
        {
            title      : 'General Help',
            id         : 'info-panel',
            autoScroll : true,
            listeners  : {
                afterrender : function(obj){
                    FrontSuite.util.ext.get({ type: 'help', key: 'general.help.panel' }, function (response, message) {
                        if (response.success) {
                            Ext.getCmp('info-panel').update(response.data);
                        }
                        else {
                            Ext.MessageBox.show({
                               title   : 'Status',
                               msg     : 'server-side failure: ' + message,
                               buttons : Ext.MessageBox.OK
                            });
                        }
                    });
                }
            },
            tools : [{
                type : 'edit',
                handler : function(event, toolEl, panel){
                    Ext.create('Ext.window.Window', {
                        title  : 'Message / Info Editor - ' + Ext.getCmp('info-panel').title,
                        width  : 550,
                        height : 250,
                        frame  : true,
                        layout : 'fit',
                        shadowOffset : 25,
                        tools  : [{
                            type    : 'save',
                            handler : function(event, toolEl, panel){
                                var content = Ext.getCmp('info-panel-htmledit').getValue();
                                Ext.getCmp('info-panel').update(content);

                                FrontSuite.util.ext.put({ type: 'help', key: 'general.help.panel', data: content }, function (response, message) {
                                    if (response.success) {
                                        Ext.MessageBox.show({
                                           title   : 'Status',
                                           msg     : 'Changes saved successfully.',
                                           buttons : Ext.MessageBox.OK
                                        });
                                    }
                                    else {
                                        Ext.MessageBox.show({
                                           title   : 'Status',
                                           msg     : 'server-side failure: ' + message,
                                           buttons : Ext.MessageBox.OK
                                        });
                                    }
                                });
                            }
                        }],
                        items : {
                            xtype            : 'htmleditor',
                            id               : 'info-panel-htmledit',
                            enableColors     : true,
                            enableAlignments : true
                        }
                    }).show();

                    if (Ext.getCmp('info-panel').body.dom.innerHTML != null) {
                        Ext.getCmp('info-panel-htmledit').setValue(Ext.getCmp('info-panel').body.dom.innerHTML);
                    }
                }
            }]
        }
    ]
});

